<template>
    <a-form class="LayoutView">
        <Item v-model:Value="Children[index]" v-for="(item, index) in Children" />
        <a-button type="primary" @click="Add">添加</a-button>
    </a-form>
</template>
<script setup>
import { ref } from "vue";
import Item from "./Item.vue";

var Children = ref([
    {
        key: "",
        value: "",
    },
]);

const Add = () => {
    Children.value.push({
        key: "",
        value: "",
    });
};

defineExpose({
    GetValue: function () {
        var _data = {};
        for (let i = 0; i < Children.value.length; i++) {
            const element = Children.value[i];
            if (element.key && element.value) {
                _data[element.key] = element.value;
            }
        }
    },
});
</script>
<style scoped>
.LayoutView {
    height: 100%;
    min-height: 200px;
}
</style>
